{extend name="public/common"}
{block name="style"}
<title>点对点教育VIP学员_成功学员</title>
<link rel="stylesheet" href="__HOME__/css/mui/mui.min.css">
<link rel="stylesheet" href="__HOME__/css/good/good.css">
<style>
    .default {
        width: 100%;
        height: 100%;
        position:absolute;
    }
    .default img {
        width: 19vw;
        height: 29vw;
        margin-top: 22vh;
        margin-left: 41vw;
    }
    .mui-pull-bottom-pocket{
     height: 10vw!important;
    }
    .mui-pull-caption{
     font-size: 1.3rem;
    }

    .mui-popover .mui-table-view{
        text-align: center;
    }
    #popover {
        height: 300px;
    }
    .bott{
        width:100%;
        text-align: center;
        height:4vw;
        position: relative;
        z-index:9999;
        display: none;
        margin-top:50vw;
        font-size:1.6rem;
    }
    .top{
        height:42vw;
        background:url("__HOME__/images/rank/11.png") no-repeat center center;
        background-size:cover;
        position: relative;
        z-index:100;
    }
</style>
{/block}
{block name="body"}
<div class="personal-intro">
    <a id="openPopover" href="#popover" data-id="{$name}"><p>{$name}</p></a>
</div>
<div class="top">

</div>
<p class="bott">&nbsp;加载中...</p>
<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
    <div class="mui-scroll">
        <div class="mui-slider-group">
<div class="list">
    <ul>
        {empty name="list"}
        <div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"> </div>
        {else/}
        {volist name="list" id="lo"}
        <li>
            <a class="head" href="{:Url('Good/detail?id='.$lo['id'])}">
                <img src="__HOME__/images/good/good.png">
                <div class="name">
                    <span>{$lo.name}</span>
                    <span style="padding-left: 10vw;">{$lo.certi_achi} 分</span>
                </div>
                <span style="color:#ccc;font-size: 1.3rem;margin-top: 3vw;margin-left: 10vw;">查看 ></span>
            </a>
        </li>
        {/volist}
    </ul>
    {/empty}
</div>
        </div>
        </div>
    </div>
<div id="popover" class="mui-popover" >
    <div class="mui-scroll-wrapper">
        <div class="mui-scroll">
            <ul class="mui-table-view">
                {volist name="deps" id="de"}
           <li class="mui-table-view-cell" data-id="{$de}"><a>{$de}</a></li>
                {/volist}
            </ul>
        </div>
    </div>
</div>

{/block}
{block name="script"}
<script src="__HOME__/js/reset.js"></script>
<script src="__HOME__/js/mui.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>
<script>
    $('title').text('点对点教育VIP学员_成功学员');
    window.onload = function(){
        if($(".list ul li").length<20){
            mui('#refreshContainer').pullRefresh().disablePullupToRefresh();
        }else{
            mui('#refreshContainer').pullRefresh().enablePullupToRefresh();
        }
    };
    mui('.mui-scroll-wrapper').scroll();
if(sessionStorage.getItem("bb") !="" && sessionStorage.getItem("bb") !=null){
    var bb = JSON.parse(sessionStorage.getItem("bb"))
    var cc =sessionStorage.getItem("cc");
    $("#openPopover p").html(cc);
    $(".list ul li").each(function(){
        $(this).remove();
    });
    addMeets(bb)
}
    $("#popover ul li").click(function(){
        var select_it = $(this).text();
        var id = $(this).data("id");
        $("#openPopover p").html(select_it);
        $("#openPopover").attr("data-id",id);
        sessionStorage.setItem("bb","");
        sessionStorage.setItem("cc","");
        $(".list ul li").each(function(){
            $(this).remove();
        });
        $(".default").remove();
        $.ajax({
            type:"post",
            url:"{:Url('Good/select')}",
            data:{
                id:id
            },
            beforeSend: function(XMLHttpRequest){
                $(".bott").show();
                mui('#refreshContainer').pullRefresh().disablePullupToRefresh();
            },
            success:function(data){
                sessionStorage.setItem("bb",JSON.stringify(data))
                sessionStorage.setItem("cc",select_it);
                if(data.code == 1){
                    $(".bott").hide();
                    mui('#refreshContainer').pullRefresh().refresh(true);
                    mui('#refreshContainer').scroll().scrollTo(0,0);
                    mui('#refreshContainer').pullRefresh().refresh(true);
                    addMeets(data);
                    if($(".list ul li").length<20){
                        mui('#refreshContainer').pullRefresh().disablePullupToRefresh();
                    }else{
                        mui('#refreshContainer').pullRefresh().enablePullupToRefresh();
                    }
                }else{
                    $(".bott").hide();
                    $(".list ul" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"> </div>');
                }

            }
        })
        mui('#popover').popover("hide");
    });

    //初始化下拉加载
    mui.init({
        pullRefresh: {
            container: '#refreshContainer',
            up: {
                callback: loadScroll
            }
        }
    });
    function loadScroll(){
        var len = $(".list ul li").length;
        var id =$(".personal-intro #openPopover").attr("data-id")
        $.ajax({
            type:"post",
            url:"{:Url('Good/more')}",
            data:{
                length:len,
                id:id
            },
            beforeSend: function(XMLHttpRequest){

            },
            success:function(data){
                if(data.code == 1){
                    addMeets(data);
                    if(data.data.length == 20){
                        mui('#refreshContainer').pullRefresh().endPullupToRefresh(false);
                    }else{
                        mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
                    }
                }else{
                    mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
                }
            }
        })
    }
    function addMeets(data){
        var html = '';
        var lists = data.data;
        var len = lists.length;
        if (lists){
            for(var i = 0; i< len;i++){
                var list = lists[i];
                html+='<li>' +
                        '<a class="head" href="/DDDeducation/public/index.php/home/Good/detail/id/'+list.id+'">'+
                            '<img src="__HOME__/images/good/good.png">'+
                                '<div class="name">'+
                                    '<span>'+list.name+'</span>'+
                                    '<span style="padding-left: 10vw;">'+list.certi_achi+' 分</span>'+
                                '</div>'+
                                '<span style="color:#ccc;font-size: 1.3rem;margin-top: 3vw;margin-left: 10vw;">查看 ></span>'+
                        '</a>'+
                        '</li>';
            }
            $(".list ul" ).append(html);
        }else{
            $(".list ul" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"> </div>');
        }
    }
    mui('#refreshContainer').on('tap', 'a', function() {
        var id = this.getAttribute('href');
        window.location.href=id;
    });
    //---微信接口JS-SDK的调用
    wx.config({
        debug: false,
        appId: '{$jsSign.appId}', // 必填，公众号的唯一标识
        timestamp: "{$jsSign['timestamp']}", // 必填，生成签名的时间戳，切记时间戳是整数型，别加引号
        nonceStr: '{$jsSign.nonceStr}', // 必填，生成签名的随机串
        signature: '{$jsSign.signature}', // 必填，签名，见附录1
        jsApiList: [
            'checkJsApi',
            'chooseImage',
            'previewImage',
            'uploadImage',
            'downloadImage',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
        ]
    });

    wx.ready(function () {
        //分享到朋友圈
        wx.onMenuShareTimeline({
            title: '【点对点教育】成功学员',
            link: 'http://mp.csppat.com/DDDeducation/public/index.php/home/good/index.html',
            imgUrl: 'http://mp.csppat.com/DDDeducation/public/home/images/rank/11.png',
            success: function () {
                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                // 用户取消分享后执行的回调函数
            }
        });
        //分享给朋友
        wx.onMenuShareAppMessage({
            title: '【点对点教育】成功学员', // 分享标题
            desc: '一份努力，一份收获~~', // 分享描述
            link: 'http://mp.csppat.com/DDDeducation/public/index.php/home/good/index.html', // 分享链接
            imgUrl: 'http://mp.csppat.com/DDDeducation/public/home/images/rank/11.png', // 分享图标
            type: '', // 分享类型,music、video或link，不填默认为link
            dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
            success: function () {
                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                // 用户取消分享后执行的回调函数
            }
        });

    });
    wx.error(function (res) {
        alert('wx.error: '+JSON.stringify(res));
    });
</script>

{/block}